import React from 'react';
import { observer, inject } from 'mobx-react';
import CounterStore from '../stores/counter.store';
import { Button } from 'antd';
import MainContent from '../components/MainContent';

interface Props {
	counter?: CounterStore;
}

const Home: React.SFC<Props> = (props) => {
	const onClick = (e: React.MouseEvent<HTMLElement, MouseEvent>) => {
		props.counter!.inc(1);
	};

	return (
		<MainContent>
			<span>首页页面</span>
			<span>
				数量: {props.counter!.count} === {props.counter!.total}{' '}
			</span>
			<Button onClick={onClick}>点击</Button>
		</MainContent>
	);
};

export default inject('counter')(observer(Home));
